<script setup lang="ts">
import { ref } from 'vue'
import CookingView from './CookingView.vue'
import { getKitchenTeams } from './kitchen.ts'
import { Add, Remove, Restaurant } from '@vicons/ionicons5'
import { secondsToHms } from '@/utils/tools.ts'
import { createDiscreteApi } from 'naive-ui'
import ShowTable from './ShowTable.vue'
import OptionView from './OptionView.vue'
import { useRestaurantStore } from '@/stores/modules/restaurant.ts'
import { storeToRefs } from 'pinia'

import type { IKitchen, IBestCombResult } from './types.ts'

const cookingRef_1 = ref<InstanceType<typeof CookingView>>()
const cookingRef_2 = ref<InstanceType<typeof CookingView>>()
const cookingRef_3 = ref<InstanceType<typeof CookingView>>()
const optionRef = ref<InstanceType<typeof OptionView>>()

const { workerProgress } = storeToRefs(useRestaurantStore())
const teamNumber = ref(1)
const bestCombResult = ref<IBestCombResult | undefined>(undefined)

async function getResults() {
  const teams: IKitchen['teams'] = []

  if (cookingRef_1.value && cookingRef_2.value && cookingRef_3.value) {
    let allCookingRef = []
    if (teamNumber.value === 1) {
      allCookingRef = Array(3).fill(cookingRef_1.value)
    } else {
      allCookingRef = [cookingRef_1.value, cookingRef_2.value, cookingRef_3.value]
    }
    allCookingRef.forEach((item) => {
      const chefIds = item.getChefsIds()
      const recipeIds = item.getRecipesIds()
      teams.push({ chefIds, recipeIds })
    })
  }

  const settings = optionRef.value?.getSettings()
  if (!settings) return

  const bestCombResult_ = await getKitchenTeams({ teams, settings })

  console.log('最佳收益：', bestCombResult_.totalRevenue)
  console.log('最佳营业时间：', secondsToHms(bestCombResult_.workingTime))
  console.log('最佳组合：', bestCombResult_.combination)

  if (bestCombResult_.combination.length === 0) {
    const { dialog } = createDiscreteApi(['dialog'])
    dialog.warning({
      title: '警告',
      content: '没有厨师组合，请放宽条件！',
    })
  }

  bestCombResult.value = bestCombResult_
}
</script>

<template>
  <n-flex vertical :size="24">
    <n-alert title="餐馆开业啦！！！" type="info">
      <template #icon>
        <n-icon><Restaurant /></n-icon>
      </template>
    </n-alert>
    <n-flex :wrap="false" align="center">
      <n-button type="primary" @click="getResults">计算</n-button>
      <n-progress
        type="line"
        :percentage="workerProgress"
        indicator-placement="inside"
        status="success"
        :processing="workerProgress !== 100"
      />
    </n-flex>
    <OptionView ref="optionRef" />
    <n-flex :wrap="false">
      <div>
        <CookingView ref="cookingRef_1" />
      </div>
      <div v-show="teamNumber >= 3">
        <CookingView ref="cookingRef_2" />
      </div>
      <div v-show="teamNumber >= 3">
        <CookingView ref="cookingRef_3" />
      </div>
      <n-button-group vertical>
        <n-button :disabled="teamNumber >= 3" @click="teamNumber = 3">
          <template #icon>
            <n-icon><Add /></n-icon>
          </template>
        </n-button>
        <n-button :disabled="teamNumber <= 1" @click="teamNumber = 1">
          <template #icon>
            <n-icon><Remove /></n-icon>
          </template>
        </n-button>
      </n-button-group>
    </n-flex>
    <ShowTable :data="bestCombResult" />
  </n-flex>
</template>

<style lang="scss" scoped></style>
